<!-- 用户地址管理 -->
<template>
  <page-header-wrapper>
    <a-card class="table-card">
      <GzSearchForm :searchFunc="searchFunc" :resetFunc="() => { searchData = {} }" searchConditionNum="4">
        <a-form-item class="table-search-item">
          <a-date-picker v-model:value="searchData['statDate']" placeholder="统计截止时间" style="width:100%" />
        </a-form-item>
        <a-form-item class="table-search-item">
          <GzTreeSelect v-model:value="searchData['agentNo3']" placeholder="区县机构" :showLevel="3" />
        </a-form-item>
      </GzSearchForm>
      <!-- 列表渲染 -->
      <GzTable
        ref="infoTableRef"
        :is-pagination="false"
        :init-data="true"
        :req-table-data-func="reqTableDataFunc"
        :table-columns="tableColumns"
        :search-data="searchData"
      >
        <template #topBtnSlot>
          <a-button type="ghost" @click="statisticalTextModalRef.show()">
            <bar-chart-outlined />
            查看统计性文本详情
          </a-button>
          <a-button v-if="$access('ENT_DATA_REPORT_MEMBER_DEV_EXPT')" type="primary" @click="exportDataReports">
            <ArrowUpOutlined />
            导出
          </a-button>
        </template>
      </GzTable>
    </a-card>
  </page-header-wrapper>
  <!-- 统计性文本弹窗 -->
  <StatisticalTextModal ref="statisticalTextModalRef" />
</template>
<script lang="ts" setup>
  import { $apiRealNameList } from '@/api/dataReports/realNameTable/index'
  import StatisticalTextModal from './components/statisticalTextModal.vue'
  import { ref, reactive, getCurrentInstance } from 'vue'
  const { $infoBox, $access } = getCurrentInstance()!.appContext.config.globalProperties
  const infoTableRef = ref()
  const statisticalTextModalRef = ref()
  const searchData: any = ref({})
  // 表头
  const tableColumns = reactive([
    { key: 'agentName', title: '单位', dataIndex: 'agentName', fixed: 'left', width: 120 },
    { key: 'agentNum', title: '网点数', dataIndex: 'agentNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'oldFansNum', title: '郑州邮政权益中心会员', dataIndex: 'oldFansNum', width: 180, minWidth: 180, maxWidth: 220 },
    { key: 'totalOldMemberNum', title: '存量会员数', dataIndex: 'totalOldMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'totalOldMemberNum', title: '存量点均', dataIndex: 'totalOldMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'agentName3', title: '周新增存量会员', dataIndex: 'agentName3', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'totalOldMemberNum', title: '周新增存量会员点均', dataIndex: 'totalOldMemberNum', width: 180, minWidth: 180, maxWidth: 220 },
    { key: 'totalSyncMemberNum', title: '月新增存量会员', dataIndex: 'totalSyncMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'lastWeekSyncMemberNum', title: '月存量会员点均', dataIndex: 'lastWeekSyncMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'monthSyncMemberNum', title: '年新增存量会员', dataIndex: 'monthSyncMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'yearSyncMemberNum', title: '年新增存量会员点均', dataIndex: 'yearSyncMemberNum', width: 180, minWidth: 180, maxWidth: 220 },
    { key: 'totalMemberNum', title: '新发展会员', dataIndex: 'totalMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'lastWeekSyncMemberNum', title: '迁移会员', dataIndex: 'lastWeekSyncMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'yearSyncMemberNum', title: '周新增迁移会员', dataIndex: 'yearSyncMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'totalCstmMemberNum', title: '月新增迁移会员', dataIndex: 'totalCstmMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'lastWeekCstmMemberNum', title: '会员迁移率(F/C)', dataIndex: 'lastWeekCstmMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'monthCstmMemberNum', title: '实名会员', dataIndex: 'monthCstmMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'yearCstmMemberNum', title: '实名认证率', dataIndex: 'yearCstmMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'yearCstmMemberNum', title: '周新增实名会员排名', dataIndex: 'yearCstmMemberNum', width: 180, minWidth: 180, maxWidth: 220 },
    { key: 'yearCstmMemberNum', title: '月新增实名会员', dataIndex: 'yearCstmMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'yearCstmMemberNum', title: '月新增实名会员排名', dataIndex: 'yearCstmMemberNum', width: 180, minWidth: 180, maxWidth: 220 },
    { key: 'yearCstmMemberNum', title: '年新增实名会员', dataIndex: 'yearCstmMemberNum', width: 150, minWidth: 150, maxWidth: 180 },
    { key: 'yearCstmMemberNum', title: '年新增实名会员排名', dataIndex: 'yearCstmMemberNum', width: 180, minWidth: 180, maxWidth: 220 },
  ])
  // 请求table接口数据
  function reqTableDataFunc(params: any) {
    return $apiRealNameList({ ...params,})
  }
  // 导出报表
  const exportDataReports = () =>{
  }
  // 搜索
  function searchFunc() {
    infoTableRef.value.refTable(true)
  }
</script>